<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>测试</title>

</head>
<body>
<div class="m-tab data-ydui-tab" >
    <ul class="tab-nav">
        <li class="tab-nav-item tab-active"><a href="javascript:;">选项一</a></li>
        <li class="tab-nav-item"><a href="javascript:;">选项二</a></li>
        <li class="tab-nav-item"><a href="javascript:;">选项三</a></li>
        <li class="tab-nav-item"><a href="javascript:;">选项四</a></li>
    </ul>
    <div class="tab-panel">
        <div class="tab-panel-item tab-active">111111</div>
        <div class="tab-panel-item">222222</div>
        <div class="tab-panel-item">333333</div>
        <div class="tab-panel-item">444444</div>
    </div>
</div>

<!-- 引入YDUI样式 -->
<link type="text/css" rel="stylesheet" href="./css/ydui/ydui.css" />
<!-- 引入YDUI自适应解决方案类库 -->
<script type="application/javascript" src="./js/ydui/ydui.flexible.js"></script>
<!-- 引入jQuery 2.0+ -->
<script type="application/javascript"  src="./js/jquery/jquery.min.js"></script>
<!-- 引入YDUI脚本 -->
<script type="application/javascript"  src="./js/ydui/ydui.js"></script>
<script>
    !function ($) {
        $('#J_Btn').on('click', function () {
            /* 使用：js模块以dialog为例 */
            YDUI.dialog.alert('我有一个小毛驴我从来也不骑！');
        });
    }(jQuery);
</script>
</body>
</html>